<template>
<div class="w-100">
  <div class="title rounded shadow-harsh bar">
    原料信息
  </div>

<!--  此处的表格写死 因为不是原料信息表-->

  <div class="mt-30">
    <!--    通过字段进行 filter-->
    <el-table
      @row-click="rowClickHandler"
      class="shadow-harsh rounded p-5"
      :data="tableData.filter(data => !search || data.address.toLowerCase().includes(search.toLowerCase()))"
    >
      <el-table-column
        type="index"
        align="center"
        width="100">
      </el-table-column>
      <el-table-column
        label="表名"
        prop="name">
      </el-table-column>

<!--      <el-table-column-->
<!--        align="right">-->

<!--        <template slot-scope="scope">-->
<!--          <el-button-->
<!--            size="mini"-->
<!--            type="primary"-->
<!--            @click="rowClickHandler(scope.row)">查看</el-button>-->
<!--          <el-button-->
<!--            size="mini"-->
<!--            type="danger"-->
<!--            @click="handleDelete(scope.$index, scope.row)">删除</el-button>-->
<!--        </template>-->
<!--      </el-table-column>-->
    </el-table>
  </div>
</div>
</template>

<script>
import router from "../../router";


export default {
  name: "MaterialInfo",

  data() {
    return {
      tableData: [{
        name: '不同品种辣椒外形描述表',
        value: 'shapeDesc',
      }, {
        name: '营养成分表',
        value: 'nutrition',
      }, {
        name: '配料展开表',
        value: 'ingredient',
      }, {
        name: '原料批次入场检验表',
        value: 'ingredient_check',
      },  {
        name: '产品维护表',
        value: 'product_maintain',
      }
      // , {
      //   name: '辣椒科研表',
      //   value: 'chili_research',
      // }, {
      //   name: '花椒科研表',
      //   value: 'flower_chili_research',
      // },
      ],
      search: ''
    }
  },
  methods: {

    rowClickHandler(row) {
      console.log(row)
      router.push({ path: `/table/${row.value}` })
    }
  },
};
</script>

<style scoped>

</style>